<style>
	/*地图*/
	.tooltip {
		position: absolute;
		display: inline-block;
		margin: 10px 20px;
		opacity: 1;
	}

	.tooltip.top {
		padding: 5px 0;
		margin-top: -3px;
	}

	.tooltip.top .tooltip-arrow {
		bottom: -2px;
		left: 50%;
		margin-left: -5px;
		border-width: 8px 8px 0;
		border-top-color: #4b8cfa;
	}
	.tooltip.top .tooltip-arrow.up{  top: -3px;
		border-width: 0 8px 8px;
		border-bottom-color: #4b8cfa;}
	.tooltip-arrow {
		position: absolute;
		width: 0;
		height: 0;
		border-color: transparent;
		border-style: solid;
	}

	.tooltip-inner {
		padding: 10px 20px;
		color: #333;
		text-align: center;
		background-color: #dcf7ff;
		border-radius: 4px;
		border: #4b8cfa 3px solid;
		text-align: left;
		box-shadow: 2px 2px 5px #5b5b5b;
	}

	.tooltip-inner h4 {
		margin: 5px 0 10px 0;
	}

	.tooltip-inner p {
		margin: 5px 0;
		font-size: 12px;
	}

	.tooltip-inner hr {
		height: 1px;
		border: none;
		border-top: 1px dashed #0066CC;
	}

	/*模态窗*/
	@media (min-width: 992px) {
		.modal-lg {
			width: 900px;
		}
	}

	@media (min-width: 1600px) {
		.modal-lg {
			width: 1200px;
		}
	}
	.gmap:hover polygon,.gmap:hover path{stroke:#ff0000;fill:#FC0; cursor:pointer}
	.gmap text{pointer-events: none;}

	/**/
	.mapcontainer{    display: inline-block;
		height: 100%;
		width:100%;
		overflow: hidden;
		text-align: center;
		position: relative;
		background-color: #ffffe3;
	}
	.mapoutline{position: absolute;
		top: 50%;
		margin-top: -350px;
		left: 50%;
		margin-left: -450px;}

</style>
<div  class="mapcontainer">
	<div  class="mapoutline">
		<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 width="900px" height="700px" viewBox="0 0 900 700" enable-background="new 0 0 900 700" xml:space="preserve">
<g id="aid">
	<rect id="bg" x="0" y="0.264" fill="#FFFFE3" width="900" height="700"/>
	<g>
		<polygon fill="#E6EFE7" points="389.338,162.597 584.5,-7.128 -6.75,-3.903 -6.75,306.014 192.17,227.523 		"/>
		<g>
			<polyline fill="none" stroke="#000000" stroke-width="4" stroke-miterlimit="10" stroke-dasharray="5,6,12,6" points="
				-6.75,306.014 192.17,227.523 389.338,162.597 583.914,-6.618 			"/>
		</g>
	</g>
	<g enable-background="new    ">
		<text transform="matrix(1 0 0 1 227.5618 188.7822)" fill="#84785E" font-family="'MicrosoftYaHei'" font-size="12">蒙古国</text>
	</g>
	<g enable-background="new    ">
		<text transform="matrix(1 0 0 1 317.9539 220.3486)" fill="#84785E" font-family="'MicrosoftYaHei'" font-size="12">二连浩特</text>
	</g>
	<g enable-background="new    ">
		<text transform="matrix(1 0 0 1 609.2268 200.2617)" fill="#84785E" font-family="'MicrosoftYaHei'" font-size="12">苏尼特左旗</text>
	</g>
	<g enable-background="new    ">
		<text transform="matrix(1 0 0 1 633.1409 457.8125)" fill="#84785E" font-family="'MicrosoftYaHei'" font-size="12">镶黄旗</text>
	</g>
	<g enable-background="new    ">
		<text transform="matrix(1 0 0 1 715.0569 359.4395)" fill="#84785E" font-family="'MicrosoftYaHei'" font-size="12">白旗</text>
	</g>
	<g enable-background="new    ">
		<text transform="matrix(1 0 0 1 542.2659 532.4248)" fill="#84785E" font-family="'MicrosoftYaHei'" font-size="12">商都县</text>
	</g>
	<g enable-background="new    ">
		<text transform="matrix(1 0 0 1 477.2014 562.9756)" fill="#84785E" font-family="'MicrosoftYaHei'" font-size="12">赛后旗</text>
	</g>
	<g enable-background="new    ">
		<text transform="matrix(1 0 0 1 264.3245 444.4453)" fill="#84785E" font-family="'MicrosoftYaHei'" font-size="12">四子王旗</text>
	</g>
	<polyline fill="none" stroke="#D6D6D6" stroke-miterlimit="10" points="688.425,353.732 702.731,345.18 707.752,338.244
		811.073,216.044 900,162.597 	"/>
	<polyline fill="none" stroke="#D6D6D6" stroke-miterlimit="10" points="900,464.197 835.072,453.035 708.084,368.257
		700.77,363.811 689.418,353.688 	"/>
	<polyline fill="none" stroke="#D6D6D6" stroke-miterlimit="10" points="538.444,503.489 558.65,508.033 668.156,512.664
		900,538.405 	"/>
	<polyline fill="none" stroke="#D6D6D6" stroke-miterlimit="10" points="739,700.264 615.878,623.881 538.444,546.058
		527.081,541.753 518.518,532.426 	"/>
	<polyline fill="none" stroke="#D6D6D6" stroke-miterlimit="10" points="210.5,708.764 381.567,624.356 460.72,553.948
		467.177,544.981 483.198,526.688 484.808,524.388 	"/>
</g>
<g id="town_6" class="gmap">
	<polygon id="_x30_1_2_" fill="#B7568B" stroke="#444444" stroke-miterlimit="10" points="430.502,355.703 418.783,331.549
		428.589,312.897 415.198,302.853 401.327,297.114 391.282,297.114 382.197,288.982 364.498,297.114 352.543,308.115
		328.39,314.331 325.761,316.723 322.411,282.287 322.411,277.026 322.411,261.243 308.065,242.59 300.41,236.851 290.367,240.677
		279.367,236.851 258.323,236.851 258.323,232.547 252.106,227.285 248.758,227.285 248.758,229.199 228.67,222.024
		223.887,215.806 192.799,227.285 192.799,231.59 199.494,249.786 224.844,271.286 248.758,273.199 264.54,298.548 273.628,305.722
		286.542,313.375 297.542,334.897 304.717,346.017 304.238,350.943 322.891,381.293 331.022,392.771 331.022,397.555
		355.412,409.51 356.846,416.684 368.803,420.99 375.023,415.25 379.206,403.293 379.087,383.684 386.98,379.977 391.524,373.641
		397.98,375.313 416.154,364.553 423.968,363.943 420.818,362.281 420.457,358.096 	"/>
	<text transform="matrix(1 0 0 1 318.3875 350.9414)" font-family="'MicrosoftYaHei'" font-size="12"> 额仁淖尔苏木 </text>
</g>
<g id="town_5"  class="gmap">
	<polygon id="_x30_2" fill="#CC72F2" stroke="#444444" stroke-miterlimit="10" points="467.805,268.894 474.262,273.917
		485.026,281.449 490.047,277.145 492.916,268.894 504.396,259.569 510.133,247.732 508.34,238.046 518.383,227.285
		528.071,227.285 528.071,215.806 532.134,214.013 546.006,200.74 548.157,196.436 537.756,196.436 536.678,198.947 519.82,194.284
		521.614,182.088 496.864,180.294 487.489,183.164 458.481,182.088 449.513,177.783 425.957,177.783 411.49,175.272
		407.187,170.609 389.966,162.359 389.966,172.044 394.631,181.011 394.631,197.87 384.947,238.046 387.817,253.47 384.947,259.928
		391.403,272.84 382.197,288.982 391.282,297.114 401.327,297.114 413.354,302.09 428.589,312.897 433.371,312.897 446.284,304.407
		444.132,301.896 453.819,297.95 456.688,294.004 455.969,286.112 465.176,278.221 463.862,274.156 468.881,274.992 	"/>
	<text transform="matrix(1 0 0 1 404.2327 239.9814)" font-family="'MicrosoftYaHei'" font-size="12"> 乌日根塔拉镇 </text>
</g>
<g id="town_3"  class="gmap">
	<polygon id="_x30_3_2_" fill="#9EDB6E" stroke="#444444" stroke-miterlimit="10" points="512.286,291.852 528.548,281.808
		534.287,268.417 548.157,268.417 548.157,273.199 559.635,277.026 571.115,275.591 571.115,277.983 576.377,276.548
		578.288,280.135 575.899,287.07 577.154,287.19 585.943,288.026 592.399,291.852 603.506,288.073 628.988,286.112 633.77,286.112
		636.401,280.852 629.464,275.113 620.378,271.764 617.507,259.33 614.16,255.504 607.464,249.786 608.422,244.763 592.399,233.503
		596.943,233.503 586.42,223.459 578.769,209.589 570.158,200.502 563.463,195.719 548.157,196.436 534.298,211.946
		528.071,215.806 528.071,227.285 518.383,227.285 508.34,238.046 510.133,247.732 503.23,261.452 492.916,268.894 490.047,277.145
		495.07,278.94 499.132,284.679 	"/>
	<text transform="matrix(1 0 0 1 508.7434 249.7852)" font-family="'MicrosoftYaHei'" font-size="12"> 阿其图乌拉苏木 </text>
</g>
<g id="town_2"  class="gmap">
	<polygon id="_x30_4" fill="#5381DB" stroke="#444444" stroke-miterlimit="10" points="572.907,291.852 569.679,302.972
		572.907,308.352 569.679,315.527 563.581,320.071 568.783,327.508 566.213,336.57 564.657,352.473 572.37,362.16 571.654,368.977
		592.399,374.357 576.135,384.041 578.245,387.135 582.236,388.885 583.043,393.816 585.733,394.398 591.652,402.117
		596.225,425.652 602.68,418.119 613.982,418.418 624.528,408.094 623.129,405.447 625.819,405.027 633.77,392.291 639,385.027
		657.742,374.447 656.666,372.652 662.114,369.646 662.756,366.118 665.986,365.077 674.065,364.672 680.968,362.25
		681.059,359.739 689.053,353.495 680.88,353.191 680.88,350.943 682.315,346.017 678.368,339.56 666.531,334.538 663.661,324.136
		656.489,324.853 662.228,318.396 655.052,315.168 658.998,310.505 656.845,304.407 661.868,301.178 661.152,297.95
		646.086,293.645 643.573,286.83 636.401,280.852 633.77,286.112 603.506,288.073 593.356,291.852 585.943,288.026 575.899,287.07
		"/>
	<text transform="matrix(1 0 0 1 573.7903 346.0186)" font-family="'MicrosoftYaHei'" font-size="12"> 赛罕乌力吉苏木 </text>
</g>
<g id="town_7"  class="gmap">
	<polygon id="_x30_5_1_" fill="#DB6B52" stroke="#444444" stroke-miterlimit="10" points="573.089,401.26 553.538,418.568
		547.781,422.852 533.18,426.639 530.759,423.768 516.115,433.904 503.23,433.904 499.132,431.033 487.489,429.598 479.287,420.99
		473.007,422.602 468.286,428.641 466.371,436.055 470.319,441.076 467.089,448.25 463.144,462.957 455.373,467.861
		450.591,467.861 443.775,481.475 448.199,493.688 455.656,494.299 462.697,498.918 467.81,499.428 483.606,523.521
		490.047,525.732 499.132,528.123 502.244,536.254 504.633,538.168 512.288,533.863 514.487,536.045 518.472,534.707
		519.463,530.992 515.424,529.945 515.696,526.539 525.022,520.979 534.768,510.426 539.073,503.252 544.39,496.049 552.64,488.426
		552.956,482.102 555.032,480.355 558.441,479.34 558.861,468.518 563.581,466.977 571.355,466.977 579.365,459.551
		576.764,451.748 580.352,447.623 577.929,443.408 581.785,439.193 584.299,439.141 588.336,434.859 592.399,433.424
		597.481,425.652 591.652,402.117 585.911,395.789 582.055,398.748 	"/>
	<text transform="matrix(1 0 0 1 477.4866 472.1855)" font-family="'MicrosoftYaHei'" font-size="12"> 朱日和镇 </text>
</g>
<g id="town_4"  class="gmap">
	<polygon id="_x30_6" fill="#6BBDE1" stroke="#444444" stroke-miterlimit="10" points="571.654,368.758 572.37,361.941
		564.657,352.258 566.213,336.353 568.783,327.288 563.581,319.854 569.679,315.31 572.907,308.136 569.679,302.755
		572.907,291.636 575.899,286.853 578.288,279.918 576.377,276.331 571.115,277.766 571.115,275.375 559.635,276.809
		548.157,272.983 548.157,268.2 534.287,268.2 528.548,281.592 512.286,291.636 499.132,284.463 495.07,278.723 490.047,276.928
		485.026,281.233 474.262,273.699 467.805,268.678 468.881,274.776 463.862,273.94 465.176,278.004 455.969,285.896
		456.688,293.788 453.819,297.734 444.132,301.679 446.284,304.19 433.371,312.68 433.025,312.68 441.621,319.615 456.328,341.855
		454.175,345.801 467.089,345.801 474.622,345.801 479.285,343.289 487.489,344.365 509.777,339.702 509.777,343.648
		506.19,350.725 513.004,358.355 518.742,369.115 508.699,379.159 508.34,390.997 504.755,389.203 504.036,406.063 499.132,422.922
		502.242,429.02 499.132,430.814 503.23,433.684 516.115,433.684 530.759,423.551 533.18,426.42 547.781,422.633 553.538,418.348
		573.089,401.041 582.055,398.529 585.911,395.57 591.652,401.9 585.733,394.182 583.043,393.598 582.236,388.665 578.245,386.918
		576.135,383.823 592.399,374.137 	"/>
	<text transform="matrix(1 0 0 1 471.136 327.5059)" font-family="'MicrosoftYaHei'" font-size="12"> 桑宝拉格苏木 </text>
</g>
<g id="town_1"  class="gmap">
	<polygon id="_x30_7_3_" fill="#E7C46D" stroke="#444444" stroke-miterlimit="10" points="443.775,480.295 441.621,475.035
		439.713,469.797 430.502,464.033 434.448,455.424 421.174,449.686 392.838,441.436 368.803,420.99 377.191,409.055
		380.044,402.117 379.087,383.684 387.839,378.779 391.524,373.641 399.372,374.486 415.038,365.213 423.968,363.943
		420.818,362.281 420.457,358.096 430.502,355.703 418.783,331.549 428.589,312.897 433.371,312.897 441.621,319.831
		456.328,342.071 454.175,346.017 467.089,346.017 474.622,346.017 479.285,343.506 487.489,344.583 509.777,339.919
		509.777,343.865 506.19,350.943 513.004,358.573 518.742,369.334 508.699,379.379 508.34,391.217 504.755,389.422 504.036,406.282
		499.132,423.141 502.242,429.24 499.132,431.033 487.489,428.521 478.388,420.99 471.753,422.602 468.165,429.598 466.371,436.055
		470.319,441.076 466.909,447.354 463.144,462.957 455.373,467.861 450.591,467.861 	"/>
	<text transform="matrix(1 0 0 1 408.783 402.1172)" font-family="'MicrosoftYaHei'" font-size="12"> 赛汉塔拉镇 </text>
</g>
</svg>
	</div>
    </div>
    <div style="display: none" id="dataDIv" class="tooltip top" role="tooltip" style=" left:0px;top:0px;">
        <div class="tooltip-arrow"></div>
        <div class="tooltip-inner">
            <h4><em id="townNameEm">额仁淖尔苏木</em> </h4>
            <hr>
            <p>贫困户数：<em id="povertyFamilyNum">800</em></p>
            <p>贫困人口数：<em id="povertyPopEm">1600</em></p>
            <p>贫困人口占比：<em id="povertyRateEm">10%</em></p>
            <hr/>
        </div>
    </div>
<script type="text/javascript" src="/govpover/index/js/jquery-1.11.3.min.js"></script>
<script>
    jQuery(function ($) {
    	var list = ( $!pkListStr)
        $(".gmap").mouseover(function (event) {
        	$("#dataDIv").show();
        	var id = $(this)[0].id
            var curleft = parseInt($(event.target).offset().left) - 20;
            var curtop = parseInt($(event.target).offset().top + $(event.target).outerHeight()) - 120;
            //alert(curleft + "|" + curtop)
			if(curtop<0){
				curtop=curtop+234
				$(".tooltip-arrow").addClass("up")
			}
			else{
				$(".tooltip-arrow").removeClass("up")
			}
			$.each(list,function(index,ob){
				if(("town_"+ ob.townId)  === id){
					$("#townNameEm").text(ob.townName)
					$("#povertyPopEm").text(ob.povertyPop)
					$("#povertyFamilyNum").text(ob.povertyFamilyNum)
					$("#povertyRateEm").text(ob.povertyRatePercent)
				}
			})
			$("#dataDIv").css("top", curtop + "px").css("left", curleft + "px")
        });
    })
</script>